<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>Table</title>
		<link rel="stylesheet" href="/addons/hc_answer/template/plugins/layui/css/layui.css" media="all" />
		<link rel="stylesheet" href="/addons/hc_answer/template/css/global.css" media="all">
		<link rel="stylesheet" type="text/css" href="/addons/hc_answer/template/plugins/font-awesome/css/font-awesome.css">
		<link rel="stylesheet" href="/addons/hc_answer/template/css/table.css" />
	</head>
	<body>
		<div class="admin-main">
			<!-- <blockquote class="layui-elem-quote">
				<div class="layui-inline">
					<select name="quiz" class="layui-input" id="cate_id">
						<option value="">全部分类</option>
						{loop $cate $item}
						<optgroup label="{$item['name']}">
						{loop $item['children'] $v}
							<option value="{$v['id']}" {if $v['id'] == $cate_id}selected="selected"{/if}>{$v['name']}</option>
						{/loop}
						</optgroup>
						{/loop}
					</select>
				</div>
				<div class="layui-inline">
					<select name="quiz" class="layui-input" id="easy">
						<option value="">全部难度</option>
						<optgroup label="难易度">
							<option value="1" {if $easy == 1}selected="selected"{/if}>简单</option>
							<option value="2" {if $easy == 2}selected="selected"{/if}>一般</option>
							<option value="3" {if $easy == 3}selected="selected"{/if}>复杂</option>
						</optgroup>
					</select>
				</div>
				<div class="layui-inline">
			    	<input class="layui-input" id="question" value="{$question}" placeholder="题目内容">
			  	</div>
				<a href="javascript:;" class="layui-btn layui-btn-small" id="search">
					<i class="layui-icon">&#xe615;</i> 搜索
				</a>
			</blockquote> -->
			<fieldset class="layui-elem-field">
				<legend>物品列表</legend>
				<div class="layui-field-box">
					<table class="site-table table-hover">
						<thead>
							<tr>
								<th><input type="checkbox" id="selected-all"></th>
								<th>物品名称</th>
								<th>物品图标</th>
								<th>场次</th>
								<th>限时</th>
								<th>金币</th>
								<th>经验</th>
								<th>价格</th>
							</tr>
						</thead>
						<tbody>
						</tbody>
						<tfoot>
							<tr>
								<th colspan="8">
									<div id="page" class="page"></div>
								</th>
							</tr>
				
						</tfoot>
					</table>

				</div>
			</fieldset>
			<input type="hidden" id="types" value="{$types}">
		</div>
		<script type="text/javascript" src="/addons/hc_answer/template/plugins/layui/layui.js"></script>
		<script>
			layui.config({
				base: '/addons/hc_answer/template/plugins/layui/modules/'
			});
			var functional="";
			var callbackdata = function () {
				layui.use('layer', function() {
					var $ = layui.jquery;
					var groupCheckbox=$("input[name='ck']");
					for(i=0;i<groupCheckbox.length;i++){
					    if(groupCheckbox[i].checked){
					        var val =groupCheckbox[i].value;
					        if(functional.length>0){
					        	 functional+=","+val;
					        }else{
					        	functional+=val;
					        }
					    }
					}
				});
	            return functional;
	        }
			layui.use(['icheck', 'laypage','layer'], function() {
				var $ = layui.jquery,
					laypage = layui.laypage;
				$('input').iCheck({
					checkboxClass: 'icheckbox_flat-green'
				});
				
				//page
				laypage({
					cont: 'page',
					pages: {$nums},
					groups: 0,
				    first: false,
				    last: false,
				    prev:false,
				    next:'加载更多',
					jump: function(obj, first) {
						//得到了当前页，用于向服务端请求对应数据
						var curr = obj.curr;
						var types = $("#types").val();
						var html ='';
						$.ajax({
				            url:"{php echo $this->createWebUrl('selectpropajax');php}",
				            data:{page:curr,types:types},
				            type:"post",
				            dataType:"json",
				            success:function(data){
				            	layui.each(data.data, function(index, item){
				            		html += '<tr>';
				            		html += '<td><input type="checkbox" name="ck" value="'+item.id+'"></td>';
							      	html += '<td>'+item.name+'</td>';
							      	html += '<td><img style="width:50px" src="'+item.thumb+'"></td>';
							      	html += '<td>'+item.cc+'</td>';
							      	html += '<td>'+item.sj+'</td>';
							      	html += '<td>'+item.jb+'</td>';
							      	html += '<td>'+item.jy+'</td>';
							      	html += '<td>'+item.price+'</td>';
							      	html += '</tr>';
							    });
							    $("tbody").append(html);
				            },
				            error:function(data){
				                layer.alert('请稍后重试', {icon: 5});
				            }
				        });
						
					}
				});

				$('#search').on('click', function() {
					var types = $("#types").val();
					location.href='./index.php?c=site&a=entry&do=selectlib&m=hc_answer&types='+types
				});
				
				$('.site-table tbody tr').on('click', function(event) {
					var $this = $(this);
					var $input = $this.children('td').eq(0).find('input');
					$input.on('ifChecked', function(e) {
						$this.css('background-color', '#EEEEEE');
					});
					$input.on('ifUnchecked', function(e) {
						$this.removeAttr('style');
					});
					$input.iCheck('toggle');
				}).find('input').each(function() {
					var $this = $(this);
					$this.on('ifChecked', function(e) {
						$this.parents('tr').css('background-color', '#EEEEEE');
					});
					$this.on('ifUnchecked', function(e) {
						$this.parents('tr').removeAttr('style');
					});
				});
				$('#selected-all').on('ifChanged', function(event) {
					var $input = $('.site-table tbody tr td').find('input');
					$input.iCheck(event.currentTarget.checked ? 'check' : 'uncheck');
				});
			});
		</script>
	</body>

